ec2のファイルをAtomを使ってリモート編集する

せーの

2015.06.23

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

こんにちは、せーのです。今日はサラッとした話題なのですが、地味に生産性が上がって嬉しいのでやったことない方はやってみるといいかと思います。

Atomは素晴らしい

最近このdevelopers.ioのブログがMarkdown対応になり、HTMLタグを書かなくても良くなったので早速ガンガン使っているわけですが、そうなるとオフラインでブログを書きためる際にいい感じのMarkdown対応のエディタが必要になります。私はsublime textに恋をしてきたので、sublimeにプラグインを入れてやってみようかな、とも思ったのですが、ここで心機一転、最近はやりのAtomというGithubが作ったChromiumベースのエディタを使ってみることにしまして、これがまたよく出来たエディタで（しかも無料で）、UI、サクサク度、プラグインの豊富さ、アイコンのかわいさ、補完の素晴らしさ等今のところ文句なしのエディタで、現在すっかりハマっております。

vimを頑張った時代もあった

一方最近また仕事でHTMLファイルやPHPコードを書く機会がありまして、Atomで基本を書いてec2にアップロード、サーバーのファイルをvimで修正してデバッグ、というような形でシコシコやっていたのですが、Term2をどれだけカスタマイズしてもやっぱりvimでコードを書くというのは生産性が落ちてしまう、というのを実感しました。これはソースコードに関わらず設定ファイルの書き換えなどでも同じことが言えます。一時期は私もvim頑張ったのですが、才能がなかったようです。。。

リモートデバッグが便利

やはりローカルで使っているいつものエディタでサーバーのファイルも扱うのが一番生産性が高い、ということでAtomをec2につなげてリモートデバッグしてみたところ生産性がガッツリ上がったのでご紹介します。

Remote-FTPのインストール

Atomをダウンロード、インストールしたら、packageからRemote-FTPを選択してインストールします。ファイル内で日本語を使いたい人はAtom全体の日本語化プラグインも合わせてインストールしておきましょう（私はJapanese-Wrapというプラグインを使っています）。

リモート接続用のEC2を準備

リモート接続用のEC2を立てます。今回は何も考えずにPublicサブネットにEIPをつけてt2.microをサラッとひとつ立てました。

Remote-FTPの設定

アプリを一旦再起動し、カレントフォルダを決めるためにFinderから適当なフォルダ（ローカルに用意しているファイルがあるのであればそのファイルが含まれるフォルダが使いやすくて良いかと思います）をAtomにドラッグ&ドロップし、Packages → Remote-FTP → Create SFTP config fileで接続設定ファイルを開きます。

{
    "protocol": "sftp",
    "host": "example.com",
    "port": 22,
    "user": "user",
    "pass": "pass",
    "remote": "/",
    "agent": "",
    "privatekey": "",
    "passphrase": "",
    "hosthash": "",
    "ignorehost": true,
    "connTimeout": 10000,
    "keepalive": 10000,
    "keyboardInteractive": false
}

ここで設定ファイルの項目を見てみましょう。

protocol : 接続プロトコル
host : 接続先のホスト名またはIP
user : 接続ユーザ名
pass : 接続パスワード
remote : 接続先のリモートルートパス。ルートパスなのであまり限定したフォルダを設定するとそこより親に行けなくて泣く
agent : ssh-agentベースのソケットパス
privatekey : 接続に必要な秘密鍵のパス
passphrase : 秘密鍵についているパスフレーズ
hosthash : ホストの鍵の暗号化の種類（sha1かmd5）
connTimeout : タイムアウト時間
keepalive : SSHレベルのキープアライブ時間

ここに接続先のec2の情報を書き込みます。鍵のパスはローカルのパスで問題無いです。パスワード等使わない項目は空で構いません。

接続する

設定を書き込んだら保存して、Packages → Remote-FTP → Connectで接続します。

接続されると左側にremoteで指定したパスからのツリーが表示されます。ツリーが表示されない方はPackages → Remote-FTP → Toggle で表示されます。

通常通り書き込む

ツリーを右クリックすることでディレクトリの作成、ファイルの作成、ダウンロード等一般的なアクションが可能になっています。試しにフォルダとファイルを作成します。

適当に書き込んで保存してみます。

保存されているかどうかターミナルから確かめてみましょう。

ip-172-16-0-104:dev seinotsuyoshi$ ssh [email protected] -i ~/dev/key/cm_experimentation.pem
The authenticity of host '52.69.132.107 (52.69.132.107)' can't be established.
RSA key fingerprint is ee:35:fb:a5:d5:67:b9:b6:68:cf:5d:05:5a:1d:9d:28.
Are you sure you want to continue connecting (yes/no)? yes
Warning: Permanently added '52.69.132.107' (RSA) to the list of known hosts.

       __|  __|_  )
       _|  (     /   Amazon Linux AMI
      ___|\___|___|

https://aws.amazon.com/amazon-linux-ami/2015.03-release-notes/
25 package(s) needed for security, out of 54 available
Run "sudo yum update" to apply all updates.
[ec2-user@ip-172-31-7-194 ~]$ ll
合計 4
-rw-rw-r-- 1 ec2-user ec2-user 39  6月 23 13:05 test.txt
[ec2-user@ip-172-31-7-194 ~]$ cat test.txt
テスト文章
テスト文章2行目

見えている通り保存されているようです。日本語を書いてみましたが文字化けも起きていませんでした。

まとめ

いかがでしょうか。これで複数ホストを扱えるととっても嬉しいのですが、残念ながらこのプラグインは単一ホストのようです。でもこれとコード別の補完プラグインやハイライトを組み合わせると簡単なスクリプトやソースデバッグ、設定ファイルの変更が非常に楽になります。是非ともポイントポイントでお使いになってみてください。